<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />
<title>作品展示</title>
<meta content="" name="keywords" />
<meta content="" name="description" />
<link href="__CSS__style1.css" type="text/css" rel="stylesheet">
<link href="__CSS__swiper.min.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src="__JS__jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="__JS__jquery.qrcode.min.js"></script>
<style type="text/css">
	.btnclick{cursor: pointer; font-size: 16px;}
	#qrcodeTable{position: absolute; width: 180px; height: 180px; padding: 5px; background-color: #fff; right: 0px; top: 137px; display: none;}
	#qrcodeTable b{display: block; position: absolute; z-index: 10; width: 20px; height: 20px; line-height: 20px; right: -12px; top: -5px; text-align: center; border-radius: 100%; background-color: #e91e2e; color: #fff; font-size: 14px; cursor: pointer;}
	.video-box-type{height: auto;}
	.video-box-type p{font-size: 16px; line-height: 32px;}
</style>
</head>

<body style="background:#eff3f5">
<!-- <div class="code">
	<img src="__IMG__ewm.png">
	<em>快快扫描二维码报名吧！</em>
</div> -->
<div class="w">
	<div class="wangluo-top-nav">
		<div class="center-cup clearfix">
			<a href="#" class="logo-box">
				<img src="__IMG__logo.png">
			</a>
			<div class="wangluo-nav">
				<ul class="clearfix">
					<li><a href="{:U('Index/index')}">网站首页</a></li>
					<li><a href="{:U('Index/pingxuan')}">评选办法</a></li>
					<li><a href="{:U('Index/votelist')}" class="current">作品展示</a></li>
					<li><a href="{:U('Index/hezuo')}">合作联系</a></li>
					<li><a href="{:U('Index/xiazai')}">投稿下载</a></li>
				</ul>
			</div>
		</div>
	</div>
	<div class="w-banner">
		<!-- <img src="{$fstvnm.fstvpicture}" style="width:1920px;height:376px;"> -->
		<img src="__IMG__网络文化节banner.jpg">
	</div>
	<div class="center-cup" style="margin-top:20px;">
		<div class="bread-nav">
			<p>当前位置：<a href="{:U('votelist',array('fstvid'=>$detail['fstvid']))}">{$fstvnm.fstvnm}</a>><a href="{:U('votelist',array('fstvid'=>$detail['fstvid'],'netid'=>$detail['netid']))}">作品展示</a>><a href="#">{$detail.title}</a></p>
		</div>
		<div class="center-lrbox clearfix">
			<div class="left-box">
				<h4>{$fstvnm.fstvnm}《{$detail.title}》</h4>
				<em>日期：{$detail.pubtime} / 人气：{$cuntvote['votestotal']} </em>
				<div class="center-toupiao clearfix">
					<p>作者：<span>{$detail.authornm}</span>职业：<span>{$detail.vocation}</span></p>
					<div class="toupiaobtn-box clearfix">
						<div class="pic-left clearfix">
							<img src="__IMG__star.png">
							<i><b class="num">{$detail.votes}</b>票</i>
						</div>
						<div class="pic-left clearfix">
							<img src="__IMG__paihang.png">
							<i>{$pm}名</i>
						</div>
						<a class="btnclick" actid="{$detail.id}" url="{:C('WEBDOMAIN')}{:U('zuopindetails',array('atcid'=>$detail['id']))}">给TA投票</a>
					</div>
					<div id="qrcodeTable"></div>
				</div>
				
				<!--<i class="chenggong">您已经投票成功</i>-->
				<div class="left-content">
					<!-- <div class="left-banner">
					  <div class="qrcodebg" style="display: none;">
						<div id="qrcodeTable"></div>
						<span class="close">X</span>
					  </div>	
						<img src="{$detail.picture}" style="width:743px;height:224px;">
					</div> -->
					<div class="video-box-type">
						<!--<video width="760px" controls class="video-style" height="500px">
							<source src="{$detail.summary}" type="video/mp4">
							<source src="{$detail.summary}" type="video/ogg">
							您的浏览器不支持 video 标签。
						</video>-->
						{$detail.summary}
					</div>
					<!-- <p>{$detail.content}</p> -->
				</div>
			</div>
			<div class="right-box">
				<h4>人气作品</h4>
				<foreach name="renqi" item="vo">
				   <if condition="$vo.urladdr neq '' ">
					    <a href="{$vo.urladdr}">
							<div class="zp-list">
								<img src="{$vo.picture}" style="width:370px;height:245px;">
								<em>{$vo.title}</em>
							</div>
					    </a>
					<else/>	
					    <a href="{:U('zuopindetails',array('atcid'=>$vo['id']))}">
							<div class="zp-list">
								<img src="{$vo.picture}" style="width:370px;height:245px;">
								<em>{$vo.title}</em>
							</div>
					    </a>
					</if>
				</foreach>
			</div>
		</div>
		
	</div>
</div>
<include file="footerask"/>
<script type="text/javascript" >
  	$(document).ready(function($) {

  		$(window).on('scroll', function () {
  			var scrollBottom = $(window).scrollTop() + $(window).height();
                if ($(window).scrollTop() > 500) {
                    $('.code').animate({
                    	top: '30%'},800)
                } 
                if ($(document).scrollTop() = 0) {
                    //alert("滚动条已经到达顶部为0")
                    $(".code").fadeOut();
                }else if ($(document).scrollTop() = $(document).height() - $(window).height()) {
                    $(".code").fadeIn();
                };
            });
  		
  		$(".toupiaobtn-box a").click(function(event) {
  				$(this).parents(".left-box").find(".chenggong").fadeIn();
  			});
  			var timesRun = 0;
	        var interval = setInterval(function(){
	        timesRun += 1;
	        if(timesRun === 60){
	        clearInterval(interval);
	        }
	        $(".chenggong").fadeOut()
	        }, 2000);


	  	$(".content-nav .ulcontent li").click(function(event) {
	  		$(this).addClass('current').siblings('.content-nav .ulcontent li').removeClass('current')
	  	});

	  	$(".wangluo-nav ul li").click(function(event) {
	  		$(this).addClass('current').siblings('.wangluo-nav ul li').removeClass('current')
	  	});

	  	$(".tab-nav li").click(function(event) {
	  		$(this).addClass('current').siblings('.tab-nav li').removeClass('current')
	  	});

	  	$(".xuanshou-list").each(function(index, el) {
	  		$(this).hover(function() {
	  			$(this).find(".xiangxi").show();
	  		}, function() {
	  			$(this).find(".xiangxi").hide();
	  		});
	  	});


  	});

	$(".video-box-type p").each(function(index,element){
		$(this).removeAttr('style');
	})

	$('.btnclick').click(function(){ 
		var data = $(this).attr('url');
		var actid = $(this).attr('actid');
		 $.ajax({ 
		    type: 'POST', 
		    url: "{:U('sccode')}",
		    dataType:'JSON',
		    data: {data:data,actid:actid,rand:Math.random()}, 
		    success: function (data) {
				var qrcodetable = $("#qrcodeTable");
				qrcodetable.show();
				qrcodetable.html("<b>X</b><img src='/"+data.data+"' width='180' height='180'>");
				close();
		    } 
		 });
	});

	function close(){
		$("#qrcodeTable b").click(function(){
			$("#qrcodeTable").hide();
		})
	}

	

</script>

</body>
</html>
